import React, { Component } from 'react';
import {getList} from "../api"
import { connect } from 'react-redux'
import actions from "../store/actions"
import { NavBar} from 'antd-mobile'

class List extends Component {
    async getListAndSet(){
        const {dispatch}=this.props
        const resp=await getList()
        const action=actions.getList(resp.data.data)
        dispatch(action)
    }
    componentDidMount(){
        this.getListAndSet()
    }
    add(v){
        const {dispatch}=this.props
        const action=actions.addCount(v)
        dispatch(action)
    }
    render() {
        const {list}=this.props
        return (
            <div className='wrap'>
                <NavBar onBack={()=>{}}>购物车</NavBar>
                <div className="listWrap">
                    {
                        list.length>0&&list.map((v,i)=>{
                            return(
                                <dl key={i}>
                                    <input type="checkbox" checked={v.isCheck} onChange={()=>this.changeCheck()}/>
                                    <dt><img src={v.url} alt="" /></dt>
                                    <dd>
                                        <h4>{v.tit}</h4>
                                        <p>{v.desc}</p>
                                        <p>￥{v.price}</p>
                                        <p><button onClick={()=>this.add(v)}>+</button><b>{v.count}</b><button>-</button></p>
                                    </dd>
                                </dl>
                            )
                        })
                    }
                </div>
                <footer>
                    <input type="checkbox" className='checkAll'/>
                    <span>总价：￥<b>1234</b></span>
                    <div>去结算</div>
                </footer>
            </div>
        );
    }
}

const mapStateToProps = state => {
    return {
        ...state
    }
}

const mapDispatchToProps = dispatch=> {
    return {
        dispatch
    }
}

export default connect(mapStateToProps,mapDispatchToProps)(List);
